import { createStore } from "vuex";
import axios from 'axios'
export default createStore({
    // 存储的单一状态，存储的基本数据
    state: {
        isCollapse: true,
        count: 0,
        msg: 'helloworld',
        msgList: []
    },
    // 计算属性 相当于computed
    getters: {
        reverseMsg(state) {
            return state.msg.split('').reverse().join('')
        },
        // getters参数用于获得getters对象中的函数
        reverseMsgLength(state, getters) {
            return getters.reverseMsg.length
        }
    },
    // 通过store.commit() 方法触发对应函数状态变更，mutations是同步函数
    mutations: {
        // state表示上面的state对象，payload表示传过来的参数
        updateIsCollapse(state, payload) {
            state.isCollapse = !state.isCollapse
        },
        add(state) {
            state.count++
        },
        updataMsg(state, value) {
            state.msgList = value
        }
    },
    actions: {
        // context与store实例有相同的属性和方法
        getAxios(context, payload) {
            axios
                .get(
                    "/api/trpc.qqnews_web.kv_srv.kv_srv_http_proxy/list?sub_srv_id=24hours&srv_id=pc&offset=0&limit=20&strategy=1&ext={%22pool%22:[%22top%22,%22hot%22],%22is_filter%22:7,%22check_type%22:true}"
                )
                .then((res) => {
                    console.log('res', res);
                    console.log(context.state.msgList);
                    console.log('传递的参数:', payload);
                    // console.log('context',context);

                    context.commit('updataMsg', res.data.data.list)
                });
        }
    }
})